<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>数据绑定</title>
    <script type="text/javascript" src="../js/vue.js"></script>
</head>
<body>
    <div id="root">
        单向数据绑定：<input type="text" :value="name"><br>    
        双向数据绑定：<input type="text" v-model:value="name"><br>
         <!-- v-model只能用在表单类元素，以下代码错误 -->
        <!-- <h2 v-model:x="name">你好</h2> -->
        单向数据绑定：<input type="text" :value="name"><br> 
        双向数据绑定：<input type="text" v-model="userInfo.name"><br>
       
    </div>
</body>
    <script type="text/javascript">
        const x = new Vue({
            el:"#root",
            data:{
                name:'请输入值'
            }
        })
    </script>
</html>